<template>
  <div class="app-container">
    <el-tabs v-model="activeName" class="demo-tabs">
      <el-tab-pane label="详情" :name="1"><DetailInfo v-if="activeName === 1" :detailId="id" /></el-tab-pane>
      <el-tab-pane label="修改" :name="2"><Edit v-if="activeName === 2" :detailId="id" /></el-tab-pane>
      <el-tab-pane label="终端" :name="3"><Terminal :outMerchantNo="outMerchantNo" /></el-tab-pane>
      <el-tab-pane label="商户用户" :name="4"><Merchant :outMerchantNo="outMerchantNo" /></el-tab-pane>
      <el-tab-pane label="云设备" :name="5">
        <Cloud :outMerchantNo="outMerchantNo" />
      </el-tab-pane>
      <el-tab-pane :name="7" label="出款记录" v-if="auditStatus === '2'">
        <History :merlqianleid="merlqianleid" :merchant-name="merchantName" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script setup lang="ts">
  import { ref } from 'vue';
  import { useRoute } from 'vue-router';
  import DetailInfo from './component/DetailInfo.vue';
  import Edit from './component/Edit.vue';
  import Merchant from './component/Merchant.vue';
  import Terminal from './component/Terminal.vue';
  import Cloud from './component/cloud.vue';
  import History from '@/views/laiqianle/register/component/History.vue';
  const route = useRoute();
  const activeName = ref(1);
  const id: string = ((route.query && route.query?.id) as string) || '';
  const outMerchantNo: string = ((route.query && route.query?.outMerchantNo) as string) || '';
  const merlqianleid: string = ((route.query && route.query?.merlqianleid) as string) || '';
  const merchantName: string = ((route.query && route.query?.merchantName) as string) || '';
  const auditStatus: string = ((route.query && route.query?.auditStatus) as string) || '';
</script>
